<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>学习兴税</title>
    <link rel="stylesheet" href="../css/base.css" />
    <link rel="stylesheet" href="../css/animate.css" />
    <link rel="stylesheet" href="../css/style.css" />
    <script src="../js/jquery.js"></script>
    <script src="../js/common.js"></script>
  </head>
  <body>
    <div id="questionList" class="comModal questionList questionError">
      <div class="title">增值税在线答题</div>
      <div class="outsideBox">
        <div class="insideBox">
          <div class="questionInfo">
            <div id="questionInfo">
              <div class="questionTitle">
                <div class="number">1</div>
                <div class="text">您对海豚发布的总体体验怎么样？</div>
              </div>
              <div class="list">
                <div class="item">
                  <span class="checkBox checked"></span>
                  <div class="text">
                    选择题答案，请选择正确的选择题答案，请选择正确的！选择题答案，请选择正确的！选择题答案，请选择正确的！
                  </div>
                </div>
                <div class="item">
                  <span class="checkBox"></span>
                  <div class="text">选择题答案，请选择正确的选择题答案</div>
                </div>
                <div class="item">
                  <span class="checkBox"></span>
                  <div class="text">
                    选择题答案，请选择正确的选择题答案，请选择正确的！
                  </div>
                </div>
                <div class="item">
                  <span class="checkBox"></span>
                  <div class="text">
                    选择题答案，请选择正确的选择题答案，请选择正确的！选择题答案，请选择正确的！选择题答案，请选择正确的！
                  </div>
                </div>
              </div>
            </div>
            <div class="errorInfo">
              <div class="red fs24">正确答案：<span id="trueAnswer"></span></div>
              <div class="jiexi fs18">
                解析：<span class="gray_666" id="desction"></span>
              </div>
            </div>
            <div class="btnBox">
              <div class="prevBtn" onclick="backHome()">回主页</div>
              <div id="nextBtn" class="nextBtn" onclick="nextError()">
                下一个错题
              </div>
              <div id="prevBtn" class="nextBtn hidden" onclick="prevError()">
                上一个错题
              </div>
            </div>
          </div>
          <div class="rightInfo">
            <div class="process">
              <div>答错：<span id="errorNums" class="red fs18">3题</span></div>
            </div>
            <div class="questionNum" id="questionNum">
            </div>
            <img class="listRoboot" src="../images/robot2.png" />
          </div>
        </div>
      </div>
    </div>
  </body>
  <script>
    $(function () {
      getErrors();
    });
    function nextError() {
      var errorArr = window.errorArr;
      var questionInd = window.questionInd;
      if(errorArr.includes(questionInd)){
        for (var i = 0; i < errorArr.length; i++) {
          if (errorArr[i] == questionInd) {
            if(i<(errorArr.length-1)){
              window.questionInd = errorArr[i+1];
              if((i+1)==(errorArr.length-1)){
                $("#nextBtn").addClass('hidden');
                $("#prevBtn").removeClass('hidden');
              }
              setQuestion();
            }
            break;
          }
        }
      }else{

      } 
    }
    function prevError(){
      var errorArr = window.errorArr;
      var questionInd = window.questionInd;
      if(errorArr.includes(questionInd)){
        for (var i = 0; i < errorArr.length; i++) {
          if (errorArr[i] == questionInd) {
            if(i>0){
              window.questionInd = errorArr[i-1];
              if((i-1)==0){
                $("#nextBtn").removeClass('hidden');
                $("#prevBtn").addClass('hidden');
              }
              setQuestion();
            }
            break;
          }
        }
      }else{

      } 
    }
    function getErrors() {
      var tdId = localStorage.getItem("tdId");
      ajaxRequest({
        type: "GET",
        url: "/open/exam/getAnswerDetail?tdId=" + tdId,
        success: function (res) {
          const list = res.data || [];
          window.questionInd = 0;
          
          window.errorArr = [];
          list.filter(function(v,i){
            if(v.taAnswer&&v.taResult!=='0'){
              window.errorArr.push(i);
            }
          })
          if(window.errorArr.length){
            window.questionInd =  window.errorArr[0];
          }else{
            window.questionInd = 0;
            $("#nextBtn").addClass('hidden')
          }
          $("#errorNums").text(window.errorArr.length+'题')
          window.questionList = list;
          setQuestion();
          setNumber();
          setWindow()
        },
        error: function (error) {},
      });
    }
    function setQuestion() {
      var questionInd = window.questionInd;
      var questionList = window.questionList;
      var question = questionList[questionInd].topic;
      var tpAnswer = question.tpAnswer ? JSON.parse(question.tpAnswer) : [];
      var html = "";
      if(questionList[questionInd].taAnswer){
        if(questionList[questionInd].taResult!=='0'){
          $("#questionInfo").addClass("error");
        }else{
          $("#questionInfo").removeClass("error");
        }
      }
     
      var typeName =
        question.tpType == "01"
          ? "(单选题)"
          : question.tpType == "02"
          ? "(多选题)"
          : "(判断)";
      html +=
        '<div class="questionTitle">' +
        '<div class="number">' +
        (questionInd + 1) +
        "</div>" +
        '<div class="text">' +
        question.tpContent +
        typeName +
        "</div>" +
        "</div>" +
        '<div class="list">';
      var answer = [];
      if(questionList[questionInd].taAnswer){
        answer = questionList[questionInd].taAnswer.split('');
      }
      if (question.tpType == "01" || question.tpType == "02") { 
        tpAnswer.filter(function (v, i) {
          var _val = v.substr(0, 1);
          var _class = '';
          if(answer.includes(_val)){
            _class = ' checked'
          }
          html +=
            '<div class="item'+_class+'" data-val="' +
            _val + '" data-type="' + question.tpType + '">' +
            '<span class="checkBox"></span>' +
            '<div class="text">' +
            v +
            "</div>" +
            "</div>";
        });
      } else {
        html +=
          '<div class="item '+(answer.includes('Y')?'checked':'')+'" data-val="Y" data-type="' +
          question.tpType +
          '">' +
          '<span class="checkBox"></span>' +
          '<div class="text">正确</div>' +
          "</div>" +
          '<div class="item '+(answer.includes('N')?'checked':'')+'" data-val="N" data-type="' +
          question.tpType +
          '">' +
          '<span class="checkBox"></span>' +
          '<div class="text">错误</div>' +
          "</div>";
      }

      html += "</div>";
      $("#questionInfo").html(html);
      setQuestionInfo(question)
    }
    function setQuestionInfo(obj){
      $("#trueAnswer").text(obj.tpTrueAnswer);
      $("#desction").text(obj.tpDes);
    }
    function setNumber() {
      var questionList = window.questionList;
      var htm = "";
      questionList.filter(function (v, i) {
        var _class = "item";
        if (v.taAnswer) {
          _class += v.taResult=='0'?" active": " error";
        }
        htm +=
          '<div class="' +
          _class +
          '" data-ind="' +
          i +
          '">' +
          (i + 1) +
          "</div>";
      });
      $("#questionNum").html(htm);
      $("#questionNum")
        .off("click", ".item")
        .on("click", ".item", function () {
          var ind = $(this).data("ind");
          if(ind== window.questionInd){
            return false;
          }
          var errorArr = window.errorArr;
          if($(this).hasClass('error')){
            if(ind==errorArr[0]){
                $("#nextBtn").removeClass('hidden');
                $("#prevBtn").addClass('hidden');
            }else if(ind==errorArr[errorArr.length-1]){
              $("#nextBtn").addClass('hidden');
                $("#prevBtn").removeClass('hidden');
            }
            numClick(ind);
          }
          
        });
    }
    //处理右侧数字点击
    function numClick(ind) {
      window.questionInd = ind;
      setQuestion();
    }
    function errorPage() {
      location.href = "/html/questionError.html";
    }
  </script>
</html>
